<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
        <div id="ev">
            <style>
                #ev{
                    width: 300px ;
                    height: 100px  ;
                    background:red;
                    line-height: 100px;
                    text-align: center;
                    color: #fff;
                }
            </style>
            目标元素
        </div>
        <script>
            var ev=document.getElementById('ev');
            window.addEventListener('click',function () {
                console.log('window captrue')
            },true)
            // true是捕获阶段触发

            document.addEventListener('click',function () {
                console.log('document captrue');
            },true)

            document.documentElement.addEventListener('click',function () {
                console.log('html captrue');
            },true)

            document.body.addEventListener('click',function () {
                console.log('body captrue');
            },true)
        </script>
</body>
</html>